<template>
  <div class="img-view swiper-container" v-if="imgSwitch" >
    <div class="swiper-wrapper">
      <div class="swiper-slide"  v-for="photo in photoList" @click="closeImg">
        <img  :src="photo.fileUrl  | thumbnail('_750_2048_100_0') " id="imgUrl" @load="imgLoad($event)" @gesturechange="gestureChange($event)" :class="loadClass" class="imagepic">
      </div>
    </div>
    <div class="swiper-pagination new-swiper-pagination"></div>
  </div>
</template>
<script>
  import index from  "./img-view"
  export default index ;
</script>
<style scoped>
  .img-view{
    background: #000;
    position: absolute;
    width: 100%;
    height: 101%;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    transition:all 0.25s;
    -webkit-transition:all 0.25s;
    opacity: 0;
    margin-bottom: -2px;
  }
  .swiper-slide{
    overflow-y: scroll;
  }
  img{
    position: absolute;
    height: auto;
    width: 100%;
  }
  .middleimg{
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
  }
  .new-swiper-pagination{
    position: fixed;
  }
</style>
